<template>
  <div class="get_tcas">
    <h3>查询历史性能</h3>
    <el-form :model="getHistoryPerformances" ref="getHistoryPerformances" label-width="100px" class="demo-ruleForm">
      <el-row>
        <el-col :span="5">
          <el-form-item label="对象名称" prop="objectName">
            <el-input v-model="getHistoryPerformances.objectName" placeholder="性能监控对象标识"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-form-item label="周期类型" prop="granularity">
            <el-select v-model="getHistoryPerformances.granularity" placeholder="请选择周期类型">
              <el-option
                  v-for="(i,index) in granularity"
                  :key="index"
                  :value="i">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="性能参数" prop="pmParameterName">
            <el-cascader v-model="getHistoryPerformances.pmParameterName" :options="options" :props="{ checkStrictly: true }"
                         :show-all-levels="false" clearable></el-cascader>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="开始时间" prop="starTime">

            <el-col :span="11">
              <el-date-picker type="date" placeholder="选择日期" v-model="getHistoryPerformances.starTime.date1"
                              style="width: 100%;"></el-date-picker>
            </el-col>
            <el-col class="line" :span="2">-</el-col>
            <el-col :span="11">
              <el-time-picker placeholder="选择时间" v-model="getHistoryPerformances.starTime.date2" style="width: 100%;"></el-time-picker>
            </el-col>

          </el-form-item>
        </el-col>
        <el-col :span="4">
          <el-form-item label-width="0">
            <el-button type="primary">确认</el-button>
            <el-button @click="resetForm('getHistoryPerformances')">重置</el-button>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-table
        :data="currentPerformances"
        style="width: 100%;margin:0 auto;"
        :header-cell-style="{'text-align':'center'}"
        height="250">
      <el-table-column
          fixed
          prop="object-name"
          label="对象名称"
          width="320">
      </el-table-column>
      <el-table-column
          prop="pm-parameter-name"
          label="性能参数">
      </el-table-column>
      <el-table-column
          prop="granularity"
          label="周期类型">
      </el-table-column>
      <el-table-column
          prop="digital-pm-value"
          label="门限标识">
      </el-table-column>
      <el-table-column
          prop="object-type"
          label="数字量性能值">
      </el-table-column>
      <el-table-column label="模拟量性能值">
        <el-table-column
            prop="threshold-value"
            label="最大值"
            width="80">
        </el-table-column>
        <el-table-column
            prop="threshold-value"
            label="最小值"
            width="80">
        </el-table-column>
        <el-table-column
            prop="threshold-value"
            label="平均值"
            width="80">
        </el-table-column>
        <el-table-column
            prop="threshold-value"
            label="当前值"
            width="80">
        </el-table-column>
      </el-table-column>

    </el-table>

  </div>
</template>

<script>
import {options} from "@/assets/config/PerformanceConfig";

export default {
  name: "HistoryPerformances",
  data() {
    return {
      form: {
        date1: '',
        date2: '',
      },
      granularity: ['1min', '15min', '24h'],
      thresholdType: ['HIGH', 'LOW'],
      options,
      'setTca': {
        "object-name": "PTP=/shelf=1/slot=8/subslot=1/port=101",
        "pm-parameter-name": "",
        "granularity": "",
        "threshold-type": "",
        "object-type": "",
        "threshold-value": "-23.98"
      },
      //查询性能越限阈值
      getTca: {
        objectName: '',
        granularity: '',
        pmParameterName: '',
      },
      tableData: {
        "tca-parameters": {
          "tca-parameter": [
            {
              "object-name": "PTP=/shelf=1/slot=8/subslot=1/port=101",
              "pm-parameter-name": "OPT_INPUTPOW",
              "granularity": "1min",
              "threshold-type": "low",
              "object-type": "PTP",
              "threshold-value": "-23.98"
            }
          ]
        }
      },
      //查询当前性能
      getCurrentPerformances: {
        objectName: '',
        granularity: '',
        pmParameterName: '',
        starTime: '',
      },
      currentPerformances: [{
        "object-name": "PTP=/shelf=1/slot=8/subslot=1/port=101",
        "granularity": "15min",
        "pm-parameter-name": "RX_PKT_SUM",
        "digital-pm-value": '',
        "analog-pm-value": {
          'max-value': '',
          'min-value': '',
          'average-value': '',
          'current-value': ''
        },
        "start-time": "2022-04-07T09:18:18Z ",
        "end-time": "2022-04-08T09:18:18Z "
      }],
      getHistoryPerformances: {
        objectName: '',
        granularity: '',
        pmParameterName: '',
        starTime: {
          date1:'',
          date2:'',
        },
        endTime:{
          date1:'',
          date2:'',
        },
      },

    }
  },
  methods:{
    resetForm(formName) {
      this.$refs[formName].resetFields();
    }
  }
}
</script>

<style scoped>

</style>